<script setup lang="ts">
//
// import { defineEmits } from 'vue';
const emit = defineEmits(['close'])
// const emit = defineEmits<{ (event: "close"): void }>();
</script>

<template>
  <view class="service-panel">
    <!-- 关闭按钮 -->
    <text class="close" @tap="emit('close')"> </text>
    <!-- 标题 -->
    <view class="title">产品参数</view>
    <!-- 内容 -->
    <view class="content">
      <!-- <view class="item">
        <view class="dt">无忧退货</view>
        <view class="dd">
          自收到商品之日起30天内，可在线申请无忧退货服务（食品等特殊商品除外）
        </view>
      </view>
      <view class="item">
        <view class="dt">快速退款</view>
        <view class="dd">
          收到退货包裹并确认无误后，将在48小时内办理退款，
          退款将原路返回，不同银行处理时间不同，预计1-5个工作日到账
        </view>
      </view>
      <view class="item">
        <view class="dt">满88元免邮费</view>
        <view class="dd">
          单笔订单金额(不含运费)满88元可免邮费，不满88元， 单笔订单收取10元邮费
        </view>
      </view> -->
      <view class="item">
        <view class="item_title">品牌</view>
        <view class="item_name">花卉</view>
      </view>
      <view class="item">
        <view class="item_title">药剂功效</view>
        <view class="item_name">杀虫剂</view>
      </view>
      <view class="item">
        <view class="item_title">生产企业</view>
        <view class="item_name">花香鸟语</view>
      </view>
      <view class="item">
        <view class="item_title">净含量</view>
        <view class="item_name">30g 60g 90g</view>
      </view>
      <view class="item">
        <view class="item_title">毒性</view>
        <view class="item_name">低毒</view>
      </view>
      <view class="item">
        <view class="item_title">剂型</view>
        <view class="item_name">悬浮剂</view>
      </view>
      <view class="item">
        <view class="item_title">农药成分</view>
        <view class="item_name">毒性</view>
      </view>
      <view class="item">
        <view class="item_title">农药名称</view>
        <view class="item_name">杀虫喷雾</view>
      </view>
      <view class="item">
        <view class="item_title">农药生产许可证</view>
        <view class="item_name">XM787876363</view>
      </view>
    </view>
  </view>
</template>

<style lang="scss">
.service-panel {
  padding: 0 30rpx;
  border-radius: 10rpx 10rpx 0 0;
  position: relative;
  background-color: #fff;
}
.title {
  line-height: 1;
  padding: 40rpx 0;
  text-align: center;
  font-size: 32rpx;
  font-weight: normal;
  color: #444;
}

.close {
  position: absolute;
  right: 24rpx;
  top: 24rpx;
  width: 40rpx;
  height: 40rpx;
  background: url("../../../static/images/close.png") no-repeat;
  background-size: cover;
}

.content {
  padding: 20rpx 20rpx 100rpx 20rpx;

  .item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1rpx solid #d1d1d1;
    .item_title {
      padding: 20rpx 0rpx;
      box-sizing: border-box;
      font-size: 27rpx;
    }
    .item_name {
      font-size: 27rpx;
    }
  }
}
</style>
